import 'package:flutter/material.dart';
import 'dart:io';
import 'package:fluro/fluro.dart';
import 'package:car_sale/model/Order.dart';
import '../routers/routers.dart';

class AppPage extends StatefulWidget {


  @override
  State<StatefulWidget> createState() {
    return _HomePageState();
  }
}

class _HomePageState extends State<AppPage> with SingleTickerProviderStateMixin{

  ScrollController _scrollController;
  ScrollController _listscrollController = new ScrollController();

  List orderList = new List();

  @override
  void initState() {
    super.initState();
    _scrollController = ScrollController(initialScrollOffset: 0.0);

    setState(() {
      orderList.add(new Order(img: 'assets/images/p1.jpg',title: '兴业春天开张兴业春天开张',orderNo: '2019043532',orderTime: '2019-04-28 12:24:13',price: '3126.00'));
      orderList.add(new Order(img: 'assets/images/p2.jpg',title: '兴业春天开张兴张',orderNo: '2019043532',orderTime: '2019-04-28 12:24:13',price: '3126.00'));
      orderList.add(new Order(img: 'assets/images/p3.jpg',title: '兴业春天开',orderNo: '2019043532',orderTime: '2019-04-28 12:24:13',price: '3126.00'));
      orderList.add(new Order(img: 'assets/images/p1.jpg',title: '兴业春天开张兴业春天开张',orderNo: '2019043532',orderTime: '2019-04-28 12:24:13',price: '3126.00'));
      orderList.add(new Order(img: 'assets/images/p2.jpg',title: '兴业春天开张兴业春',orderNo: '2019043532',orderTime: '2019-04-28 12:24:13',price: '3126.00'));
      orderList.add(new Order(img: 'assets/images/p3.jpg',title: '兴业春天开张兴业春天开',orderNo: '2019043532',orderTime: '2019-04-28 12:24:13',price: '3126.00'));
      orderList.add(new Order(img: 'assets/images/p1.jpg',title: '兴业春天开张兴业春天开张',orderNo: '2019043532',orderTime: '2019-04-28 12:24:13',price: '3126.00'));
      orderList.add(new Order(img: 'assets/images/p2.jpg',title: '兴业春天开张兴业春',orderNo: '2019043532',orderTime: '2019-04-28 12:24:13',price: '3126.00'));
      orderList.add(new Order(img: 'assets/images/p3.jpg',title: '兴业春天开张兴业春天开',orderNo: '2019043532',orderTime: '2019-04-28 12:24:13',price: '3126.00'));
      orderList.add(new Order(img: 'assets/images/p1.jpg',title: '兴业春天开张兴业春天开张',orderNo: '2019043532',orderTime: '2019-04-28 12:24:13',price: '3126.00'));
      orderList.add(new Order(img: 'assets/images/p2.jpg',title: '兴业春天开张兴业春',orderNo: '2019043532',orderTime: '2019-04-28 12:24:13',price: '3126.00'));
      orderList.add(new Order(img: 'assets/images/p3.jpg',title: '兴业春天开张兴业春天开',orderNo: '2019043532',orderTime: '2019-04-28 12:24:13',price: '3126.00'));
    });
  }


  @override
  void dispose() {
    _scrollController?.dispose();
    super.dispose();
  }

  Widget _GetListView () {
    return
        Column(
          children:<Widget>[
            Container(
              margin: EdgeInsets.all(12.0),
              padding: EdgeInsets.all(6.0),
              color: Colors.yellow,
              child: Row(children: <Widget>[
                Text.rich(TextSpan(
                  children: [
                    TextSpan(text: '公告: ',style: TextStyle(fontSize: 13,color: Colors.grey)),
                    TextSpan(
                        text: '优良城仓库到货通知',
                        style:  TextStyle(fontSize: 13,fontWeight: FontWeight.w400)
                    ),
                  ],
                )),
                Container(
                  margin: EdgeInsets.only(left: 100),
                  child: Text('2019-04-28',style: TextStyle(color: Colors.grey)),
                )
              ],
              ),
            ),
            Container(
              margin: EdgeInsets.only(left: 12.0),
//              padding: EdgeInsets.all(9.0),
              child: Row(
                children: <Widget>[
                  Container(
                    child: Text('订单信息',style: TextStyle(fontWeight: FontWeight.w500,fontSize: 18),),
                  ),
                  Container(
                    margin: EdgeInsets.only(left: 210),
                    child: Text('全部订单',style: TextStyle(color: Colors.grey)),
                  )
                ],
              ),
            ),
            Expanded(child: _RenderList()),
            Container(
              height: 10.0,
            )
          ],
        );

  }

  Widget _RenderList() {
    print('orderList is ${orderList.length}');
    return ListView.builder(
        itemCount: orderList.length,
        itemExtent: 70.0,
        padding: EdgeInsets.only(top: 0.0),
        itemBuilder: (BuildContext context, int index) {
          var order = orderList[index];
          return _RenderItem(order);
        }
    );
  }

  Widget _RenderItem(Order order) {
    return ListTile(
      title: Container(
          child: Column(
            children: <Widget>[
              Container(
                height: 45.0,
                child: Row(
                  children: <Widget>[
                    Container(
                      margin: const EdgeInsets.only(top: 10.0,right: 17.0),
                      width: 120.0,
                      child: Text('${order.title}',style: TextStyle(fontSize: 13)),
                    ),
                    Text.rich(TextSpan(
                      children: [
                        TextSpan(text: '订单号: ',style: TextStyle(fontSize: 13,color: Colors.grey)),
                        TextSpan(
                            text: '${order.orderNo}',
                            style:  TextStyle(fontSize: 13,fontWeight: FontWeight.w400)
                        ),
                      ],
                    ))
                  ],
                ),
              ),
              Row(
                children: <Widget>[
                  Container(
                    margin: const EdgeInsets.only( right: 30.0),
                    width: 125.0,
                    child: Text('${order.orderTime}',style: TextStyle(fontSize: 12,color: Colors.grey)),
                  ),
                  Text.rich(TextSpan(
                    children: [
                      TextSpan(text: '总价: ',style: TextStyle(fontSize: 13,color: Colors.grey)),
                      TextSpan(
                          text: '￥',
                          style: TextStyle(fontSize: 12,color: Colors.red)
                      ),
                      TextSpan(
                          text: '${order.price}',
                          style:  TextStyle(fontSize: 15,fontWeight: FontWeight.w500,color: Colors.red)
                      ),
                    ],
                  ))
                ],
              ),
            ],
          )
      ) ,
      isThreeLine:false,
      leading: Image.asset(order.img),
    );
  }

  @override
  Widget build(BuildContext context) {
    print('数目is ${orderList.length}');

    return new Container(
      height: 700,
      child: new Scaffold(
          body: NestedScrollView(
              controller: _scrollController,
              headerSliverBuilder: (BuildContext context, bool boxIsScrolled) {
                return <Widget>[
                  SliverAppBar(
//                    title: Text('Home'),
                    pinned: true,
                    floating: true,
                    forceElevated: boxIsScrolled,
                    expandedHeight: Platform.isIOS ? 265.0: 272.0,
                    flexibleSpace:  Stack(
                      overflow: Overflow.clip,
                      alignment: AlignmentDirectional.topStart,
                      children: <Widget>[
                        Container(
//                          top: 100.0,
                          margin: EdgeInsets.only(top: 0.0,bottom: 0.0),
                          height: 272.0,
                          color: Colors.blue,
//                          child:
                        ),
                        Positioned(
//                          height: 200.0 ,
                          child: Image.asset(
                            'assets/images/topbg.jpg',
                            alignment: Alignment.topCenter,
                            width: double.infinity,
                            repeat: ImageRepeat.repeat,
                            height: 195.0,
                          ),
                        ),

//                        Container(
//                          margin: const EdgeInsets.only(top: 195.0),
//                          padding: EdgeInsets.all(4.0),
//                          color: Colors.lightBlue[200],
//                          child: Row(
//                            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
//                            children: <Widget>[
//                              TextSaleColumn(title:'本月任务(元)',label:'50000',top: 2),
//                              TextSaleColumn(title:'已完成',label:'35280',top: 2),
//                              TextSaleColumn(title:'完成进度',label:'63%',top: 2),
//                            ],
//                          ),
//                        ),
//                        Container(
//                          height: 175.0,
////                          margin: const EdgeInsets.only(top: 30.0),
//                          child: Row(
//                            children: <Widget>[
//                              Container(
//                                margin: const EdgeInsets.only(left: 20.0),
//                                child: new Column(
//                                  mainAxisSize: MainAxisSize.min,
//                                  children: [
//                                    new Text('总资产(元)[车销中]',style: TextStyle(color: Colors.white70),),
//                                    new Container(
//                                      margin: const EdgeInsets.only(top: 8.0),
//                                      child: new Text(
//                                        '100000.00',
//                                        style: new TextStyle(
//                                          fontSize: 22.0,
//                                          fontWeight: FontWeight.w500,
//                                          color: Colors.white,
//                                        ),
//                                      ),
//                                    ),
//                                  ],
//                                ),
//                              ),
//                              Container(
//                                margin: const EdgeInsets.only(left: 120.0),
//                                child: new Column(
//                                  mainAxisSize: MainAxisSize.min,
//                                  children: [
//                                    new Text('昨日车销(元)',style: TextStyle(color: Colors.white70),),
//                                    new Container(
//                                      margin: const EdgeInsets.only(top: 8.0),
//                                      child: new Text(
//                                        '+2000.00',
//                                        style: new TextStyle(
//                                          fontSize: 22.0,
//                                          fontWeight: FontWeight.w500,
//                                          color: Colors.white,
//                                        ),
//                                      ),
//                                    ),
//                                  ],
//                                ),
//                              ),
//                            ],
//                          ),
//                        ),
//                        Container(
//                          height: 220.0,
//                          margin: const EdgeInsets.only(top: 50.0),
//                          child: Container(
//                            child:  Row(
//                              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
//                              children: <Widget>[
//                                TextSaleColumn(title:'产品总数(件)',label:'200'),
//                                TextSaleColumn(title:'今日销售(单)',label:'230'),
//                                TextSaleColumn(title:'本月销售(单)',label:'2250'),
//                              ],
//                            ),
//                          ),
//                        ),
                        Positioned(
                          top: 60.0,
                          left: 20.0,
//                          child: Text('总资产(元)[车销中]',style:TextStyle(color: Colors.white)),
                          child: new Column(
                            mainAxisSize: MainAxisSize.min,
                            children: [
                              new Text('总资产(元)[车销中]',style: TextStyle(color: Colors.white70,fontSize: 12),),
                              new Container(
                                margin: const EdgeInsets.only(top: 8.0),
                                child: new Text(
                                  '100000.00',
                                  style: new TextStyle(
                                    fontSize: 22.0,
                                    fontWeight: FontWeight.w500,
                                    color: Colors.white,
                                  ),
                                ),
                              ),
                            ],
                          ),
                        ),
                        Positioned(
                          top: 60.0,
                          right: 20.0,
//                          child: Text('总资产(元)[车销中]',style:TextStyle(color: Colors.white)),
                          child: new Column(
                            mainAxisSize: MainAxisSize.min,
                            children: [
                              new Text('昨日车销(元)',style: TextStyle(color: Colors.white70,fontSize: 12),),
                              new Container(
                                margin: const EdgeInsets.only(top: 8.0),
                                child: new Text(
                                  '+2000.00',
                                  style: new TextStyle(
                                    fontSize: 22.0,
                                    fontWeight: FontWeight.w500,
                                    color: Colors.white,
                                  ),
                                ),
                              ),
                            ],
                          ),
                        ),
                        Positioned (
                          top: 140.0,
                          left: 0.0,
                          right: 0.0,
                          child: Container(
                            margin: EdgeInsets.only(left: 15.0,right: 15.0),
                            child: Row(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              children: <Widget>[
                                TextSaleColumn(title:'产品总数(件)',label:'200'),
                                TextSaleColumn(title:'今日销售(单)',label:'230'),
                                TextSaleColumn(title:'本月销售(单)',label:'2250'),
                              ],
                            ),
                          ),
                        ),
                        Positioned (
                            top: 188.0,
                            left: 0.0,
                            right: 0.0,
                            height: 45.0,
                            child: Container(
                              color: Colors.blue[200],
                              child: Container(
                                margin: EdgeInsets.only(left: 15.0,right: 15.0),
                                child: Row(
                                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                  children: <Widget>[
                                    TextSaleColumn(title: '本月任务(元)',label: '200',top : 1.0),
                                    TextSaleColumn(title: '    已完成    ',label: '230',top : 1.0),
                                    TextSaleColumn(title: '  完成进度    ',label: '63%',top : 1.0),
                                  ],
                                ),
                              )
                            )
                        ),
                      ],
                    ),
                    bottom: IconButtomRow(),
                  )
                ];
              },
              body: _GetListView()
          )
      ),
    );

  }
}

class IconButtomRow extends StatelessWidget implements PreferredSizeWidget {

  @override
  Size get preferredSize => Size.fromHeight(65.2);

  @override
  Widget build(BuildContext context) {

    return Container(
      color: Colors.white,
      height: 65.0,
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        children: <Widget>[
          IconButtonColumn(Icons.check_box_outline_blank, '扫一扫'),
          IconButtonColumn(Icons.monetization_on, '收款'),
          IconButtonColumn(Icons.queue, '个人码'),
          IconButtonColumn(Icons.shopping_cart, '商城'),
        ],
      ),
    );
  }
}


class IconButtonColumn extends StatelessWidget {
  final IconData icon;
  final String label;
  IconButtonColumn(
    this.icon,
    this.label, {Key key})
  :super(key: key);

  @override
  Widget build(BuildContext context) {
    Color color = Theme.of(context).primaryColor;

    return GestureDetector(
      onTap: () => intentTo(context, label),
      child: Container(
        width: 60.0,
        color: Colors.white,
        child: new Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            Icon(icon, color: color),
            new Container(
              margin: const EdgeInsets.only(top: 8.0),
              child: new Text(
                label,
                style: new TextStyle(
                  fontSize: 14.0,
                  fontWeight: FontWeight.w500,
                  color: color,
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

intentTo(BuildContext context, String label) {
  if(label == '商城') {
    Routes.router.navigateTo(context, '${Routes.goodsList}',transition: TransitionType.fadeIn);
  } else if(label == '扫一扫') {
    print('扫一扫');
  } else if(label == '收款') {

  } else if(label == '个人码') {

  }
}



class TextSaleColumn extends StatelessWidget {
  final String title;
  final String label;
  final double top;
  TextSaleColumn({
    this.title,
    this.label,
    this.top = 8.0,
  });

  @override
  Widget build(BuildContext context) {
    Color color = Colors.white70;

    return  new Column(
      mainAxisSize: MainAxisSize.min,
      children: [
        new Text(this.title,style: TextStyle(color: color),),
        new Container(
          margin: EdgeInsets.only(top: this.top),
          child: new Text(
            label,
            style: new TextStyle(
              fontSize: 12.0,
              fontWeight: FontWeight.w500,
              color: Colors.white,
            ),
          ),
        ),
      ],
    );
  }
}


